import 'package:flutter/material.dart';
import 'package:flutter_svg/svg.dart';
import 'package:get/get.dart';
import 'package:syn_4s/core/extension/build_context_extension.dart';
import 'package:syn_4s/core/extension/int_extension.dart';
import 'package:syn_4s/core/model/lock_model.dart';
import 'package:syn_4s/ui/shared/app_theme.dart';
import 'package:syn_4s/ui/widgets/custom_ui.dart';

import '../../core/utils/date_format_utils.dart';
import '../../core/viewmodel/main_view_model.dart';
import 'main_fold.dart';

class MainSmartLock extends StatefulWidget {
  final Key? scrollKey;
  final MainViewModel viewModel;
  final String? title;

  const MainSmartLock({super.key, required this.viewModel, this.scrollKey,this.title});

  @override
  State<MainSmartLock> createState() => _MainSmartLockState();
}

class _MainSmartLockState extends State<MainSmartLock> {
  final ScrollController _controller = ScrollController();

  @override
  void initState() {
    super.initState();
    addScrollListener(_controller, widget.viewModel.isLockScrollable);
  }

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MainFold(
      scrollKey: widget.scrollKey,
      title:widget.title?? context.l10n.smart_lock,
      child: Container(
        margin: EdgeInsets.only(left: 8.px, right: 8.px, bottom: 6.px),
        height: 200.px,
        child: Obx(() => GridView.builder(
              controller: _controller,
              physics: widget.viewModel.isLockScrollable.value
                  ? const AlwaysScrollableScrollPhysics()
                  : const NeverScrollableScrollPhysics(),
              itemBuilder: (ctx, index) {
                return buildItem(context, widget.viewModel.locks[index]);
              },
              itemCount: widget.viewModel.locks.length,
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  childAspectRatio: 1.8,
                  crossAxisSpacing: 8.px,
                  mainAxisSpacing: 6.px,
                  crossAxisCount: 2),
            )),
      ),
    );
  }

  Widget buildItem(BuildContext context, LockModel lock) {
    String imageSrc = "";
    bool isCharging = (lock.battery ?? 0) > 100;
    if (isCharging) {
      imageSrc = "assets/images/lock_charging.svg";
    } else {
      if (lock.state == 0) {
        if (lock.lockState == 0) {
          // 离线、关锁
          imageSrc = "assets/images/lock_offline_close_big.svg";
        } else {
          // 离线、开锁
          imageSrc = "assets/images/lock_offline_open_big.svg";
        }
      } else {
        if (lock.lockState == 0) {
          // 在线、关锁
          imageSrc = "assets/images/lock_online_close_big.svg";
        } else {
          // 在线、开锁
          imageSrc = "assets/images/lock_online_open_big.svg";
        }
      }
    }
    return Container(
      padding: EdgeInsets.symmetric(horizontal: 8.px),
      decoration:
          BoxDecoration(border: Border.all(color: Colors.white, width: 1.px)),
      child: Row(
        children: [
          Stack(
            alignment: Alignment.bottomCenter,
            children: [
              SvgPicture.asset(
                imageSrc,
                width: 60.px,
                height: 70.px,
              ),
              Positioned(
                  bottom: 6.px,
                  child: Offstage(
                    offstage: isCharging,
                    child: Row(
                      children: [
                        Text(
                          "${lock.battery ?? 0}",
                          style: TextStyle(
                              fontSize: 20.px,
                              color: AppTheme.orangeColor,
                              fontWeight: FontWeight.w900),
                        ),
                        Text(
                          "%",
                          style: TextStyle(
                              fontSize: 12.px,
                              color: AppTheme.orangeColor,
                              fontWeight: FontWeight.w900),
                        ),
                      ],
                    ),
                  ))
            ],
          ),
          buildInfo(context, context.l10n.body_temp, lock),
        ],
      ),
    );
  }

  Widget buildLongText(String data, {int maxLines = 1}) {
    return Text(
      data,
      maxLines: maxLines,
      overflow: TextOverflow.ellipsis,
    );
  }

  Widget buildInfo(BuildContext context, String title, LockModel lock,
      {Color? color}) {
    return Expanded(
        child: Container(
      margin: EdgeInsets.only(left: 8.px),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Text(
            lock.lockName ?? "",
            style: TextStyle(
                color: AppTheme.orangeColor,
                fontWeight: FontWeight.w900,
                fontSize: 16.px),
          ),
          buildLongText(
            DateFormatUtils.dateTimeToStr(lock.portalOWAt,
                format: "dd-MM-yyyy HH:mm:ss"),
          ),
          buildLongText("${context.l10n.address}${lock.address ?? ""}", maxLines: 2),
        ],
      ),
    ));
  }
}
